<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" />
<title>ALLADYN Project homepage</title>
<link rel="stylesheet" href="../al.css" type="text/css">
<script src="../js/Alladyn.js" type="text/javascript"></script>
<script src="../js/subpaths.js" type="text/javascript"></script>
</head>

<body background="../img/bg.gif" onload="Alladyn();main()">
<div id="menu1" style="position:absolute; left:-100; top:290; z-index:3"><a href="contact.html"><img src="../img/m_feed_eng.gif" width="119" height="20"  border="0" alt=""/></a></div>
<div id="menu2" style="position:absolute; left:-100; top:130; z-index:3"><a href="desc.html"><img src="../img/m_desc_eng.gif" width="119" height="20"  border="0" alt=""/></a></div>
<div id="menu3" style="position:absolute; left:-100; top:170; z-index:3"><a href="gallery.html"><img src="../img/m_gallery_eng.gif" width="119" height="20"  border="0" alt=""/></a></div>
<div id="menu4" style="position:absolute; left:-130; top:210; z-index:3"><a href="docs.html"><img src="../img/m_docs_eng.gif" width="119" height="20"  border="0" alt=""/></a></div>
<div id="menu5" style="position:absolute; left:-100; top:250; z-index:3"><a href="down.html"><img src="../img/m_down_en.gif" width="119" height="20"  border="0" alt=""/></a></div>
<div id="menu6" style="position:absolute; left:-100; top:90; z-index:3"><a href="about.html"><img src="../img/m_about_eng.gif" width="119" height="20" border="0"  alt=""/></a></div>
<div id="blue1" style="position:absolute; left:-100; top:0; z-index:2"><img src="../img/blue_mid.gif" width="26" height="20" alt=""/></div>
<div id="blue2" style="position:absolute; left:-100; top:0; z-index:2"><img src="../img/blue_mid.gif" width="26" height="20" alt=""/></div>
<div id="blue3" style="position:absolute; left:-100; top:0; z-index:2"><img src="../img/blue_mid.gif" width="26" height="20" alt=""/></div>
<div id="blue4" style="position:absolute; left:-100; top:0; z-index:2"><img src="../img/blue_mid.gif" width="26" height="20" alt=""/></div>
<div id="blue5" style="position:absolute; left:-100; top:0; z-index:2"><img src="../img/blue_mid.gif" width="26" height="20" alt=""/></div>
<div id="blue6" style="position:absolute; left:-100; top:0; z-index:2"><img src="../img/blue_mid.gif" width="26" height="20" alt=""/></div>
<div id="alll" style="position:absolute; left:312; top:-50; z-index:8"><img src="../img/name_half1.gif" width="104" height="26"/></div>
<div id="allr" style="position:absolute; left:313; top:-50; z-index:8"><img src="../img/name_half2.gif" width="101" height="26"/></div>
<div id="poziom" style="position:absolute; left:0; top:-50; z-index:7"><img src="../img/blue_d.gif" width="780" height="34"/></div>
<div id="pozioms" style="position:absolute; left:0; top:-50; z-index:7"><img src="../img/blue_d.gif" width="780" height="18"/></div>
<div id="pozioms2" style="position:absolute; left:0; top:-20; z-index:7"><img src="../img/blue_mid.gif" width="780" height="6"/></div>
<div id="pozioms3" style="position:absolute; left:0; top:-20; z-index:7"><img src="../img/blue_mid.gif" width="780" height="3"/></div>
<div id="dhdsb" style="position: absolute; left: 13; top: -50; z-index: 10"><img src="../img/dhdsbig.gif" width="574" height="17"/></div>

<div id="title" style="position: absolute; left: 140; top: -50; z-index: 2"><img src="../img/t_docs.gif" width="562" height="35"></div>
<div id="docsmenu" class="content" style="position: absolute; left: 140; top: 160; z-index: 2; color: #8888AA; width: 562; text-align: center;">[<a href="docs.html">Table of contents</a>] [<a href="docs3.html">Next chapter &gt;</a>]</div>

<div class="content" id="content" style="position: absolute; left: 140; top: 200; width:562; z-index: 2">
<div class="content">
	<a name="r2"></a><span class="header">2. What is Alladyn?</span><br />
	Alladyn is a JavaScript library that accomplishes DHTML functions independently of the browser used. It contains a highly functional animation module.<br />
    Alladyn gives webmaster fast, easy to use and functional tool for creating dynamic websites. It allows focusing on logic and look of the website, not on differences in implementing DHTML functions by web browsers.<br />
	You can read more about this in the <a href="desc.html">About the Alladyn Project</a> section.<br /><br />
	<a name="r21"></a><span class="bold">2.1. "Cross-browsing" method used in Alladyn.</span><br />
	Instead of creating functions specific for different browsers and deciding which functions to use, Alladyn rebuilds the browser's DOM (Document Object Model) and creates new, easy to use object model.<br />
	Created object model is built on references to the model found in the browser. Therefore, thanks to not making comparisons and decision blocks, scripts written "for Alladyn" are much faster.<br />
	Alladyn's DOM is based on the <span class="b">vlay</span> object, which is the substitute of <span class="i">document.all</span> and <span class="i">document.layers</span> objects known from IE and NS4. You can read more about this in the next chapter<br /><br />
	<a name="r22"></a><span class="bold">2.2. Animation module.</span><br />
	Standard DHTML doesn't have any animation tools. Alladyn gives you movement modeling mechanisms which uses keyframes. The ability of defining a few movement types (normal, looped, bounced), controlling all the parameters that define the layers look (position, all of the CSS numeric properties, transparency, cropping) and the ability of grouping layers in independent groups of movement makes Alladyn a powerful animation tool, which functionality is almost comparable to Flash.<br /><br />
	<a name="r23"></a><span class="bold">2.3. How to use Alladyn?</span><br />
	Alladyn is a "run and forget" library. It is started only once, after the entire document is loaded (the best way to do it is to use <span class="i">&lt;body onLoad="Alladyn()"&gt;</span> in the &lt;head&gt; section). When it is started, it builds new object model with all objects, methods and properties which gives you the functionality described above (it is described more exact in the later parts of this manual).
</div>
<br />
<center>[<a href="docs.html">Table of contents</a>] [<a href="docs3.html">Next chapter &gt;</a>]</center>
<br />
</div>
</body>
</html>
